<template>
	<el-main class="bg table_wrap">
		<el-form label-position="right" :model="query" class="form p_4" label-width="120">
			<el-row>
				<el-col :xs="24" :sm="24" :lg="8" class="el_form_search_wrap">
					<el-form-item label="会议ID">
						<el-input-number v-model.number="query.meeting_id" :min="0"></el-input-number>
					</el-form-item>
				</el-col>
				<el-col :xs="24" :sm="24" :lg="8" class="el_form_search_wrap">
					<el-form-item label="主题名称">
						<el-input v-model="query.track_name"></el-input>
					</el-form-item>
				</el-col>
				<el-col :xs="24" :sm="10" :lg="8" class="search_btn_wrap_1">
					<el-form-item>
						<el-button type="primary" @click="search()" class="search_btn_find">查询</el-button>
						<el-button @click="reset()" style="margin-right: 74px;" class="search_btn_reset">重置</el-button>
					<router-link v-if="user_group == '管理员' || $check_action('/call_for_papers/table','add') || $check_action('/call_for_papers/view','add')" 
						class="el-button el-button--default el-button--primary search_btn_add" to="/call_for_papers/view?">添加
					</router-link>
						<el-button v-if="user_group == '管理员' || $check_action('/call_for_papers/table','del') || $check_action('/call_for_papers/view','del')" 
							class="search_btn_del" type="danger" @click="delInfo()">删除</el-button>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<el-table :data="list" @selection-change="selectionChange" @sort-change="$sortChange" style="width: 100%" id="dataTable">
			<el-table-column fixed type="selection" tooltip-effect="dark" width="55"></el-table-column>
			<el-table-column prop="meeting_id" label="会议ID" v-if="user_group == '管理员' || $check_field('get','meeting_id')" min-width="120"></el-table-column>
		<el-table-column prop="track_name" label="主题名称" v-if="user_group == '管理员' || $check_field('get','track_name')" min-width="250">
			<template slot-scope="scope">
				{{ $getBilingualText(scope.row['track_name']) }}
			</template>
		</el-table-column>
			<el-table-column prop="topics" label="主题内容" v-if="user_group == '管理员' || $check_field('get','topics')" min-width="200">
				<template slot-scope="scope">
					<el-tag type="info">{{ parseTopics(scope.row['topics']).length }} 个主题</el-tag>
				</template>
			</el-table-column>
			<el-table-column prop="display_order" label="显示顺序" v-if="user_group == '管理员' || $check_field('get','display_order')" min-width="120"></el-table-column>
			<el-table-column sortable prop="create_time" label="创建时间" min-width="200">
				<template slot-scope="scope">
					{{ $toTime(scope.row["create_time"],"yyyy-MM-dd hh:mm:ss") }}
				</template>
			</el-table-column>
			<el-table-column fixed="right" label="操作" min-width="120" 
				v-if="user_group == '管理员' || $check_action('/call_for_papers/table','set') || $check_action('/call_for_papers/view','set') || $check_action('/call_for_papers/view','get')">
				<template slot-scope="scope">
				<router-link class="el-button el-button--small is-plain el-button--success" style="margin: 5px !important;"
					v-if="user_group == '管理员' || $check_action('/call_for_papers/table','set') || $check_action('/call_for_papers/view','set') || $check_action('/call_for_papers/view','get')"
					:to="'/call_for_papers/view?' + field + '=' + scope.row[field]" size="small">
					<span>详情</span>
				</router-link>
				</template>
			</el-table-column>
		</el-table>

		<!-- 分页器 -->
		<div class="mt text_center">
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="query.page" :page-sizes="[7, 10, 30, 100]" :page-size="query.size"
				layout="total, sizes, prev, pager, next, jumper" :total="count">
			</el-pagination>
		</div>
	</el-main>
</template>
<script>
	import mixin from "@/mixins/page.js";

	export default {
		mixins: [mixin],
		data() {
			return {
				url_get_list: "~/api/call_for_papers/get_list?like=0",
				url_del: "~/api/call_for_papers/del?",
				field: "call_for_papers_id",
				query: {
					"size": 7,
					"page": 1,
					"meeting_id": "",
					"track_name": "",
					"create_time": "",
					"orderby": `create_time desc`
				},
			}
		},
		methods: {
			search() {
				this.query.page = 1;
				this.get_list();
			},
			parseTopics(str) {
				try {
					return JSON.parse(str);
				} catch (e) {
					return [];
				}
			}
		},
		created() {
			this.get_list();
		}
	}
</script>
<style>
</style>

